<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>back-med</title>
    <link rel="stylesheet" href="/admin/layui-v2.4.5/layui/css/layui.css"  media="all">
    <link rel="stylesheet" href="/admin/css/admin.css"  media="all">
</head>
<body>

<script src="/admin/layui-v2.4.5/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="/admin/js/jquery.js"></script>

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
    <legend>查看药房收支</legend>
</fieldset>
<!--药房报表直接用月份,可选择月份范围，也可选择整年的-->
<!--<div class="layui-form">-->
    <!--<div class="layui-form-item">-->
        <!--<div class="layui-inline">-->
            <!--<label class="layui-form-label">日期范围</label>-->
            <!--<div class="layui-input-inline">-->
                <!--<input type="text" class="layui-input" id="test6" placeholder=" - ">-->
            <!--</div>-->
        <!--</div>-->
    <!--</div>-->
<!--</div>-->

<div class="wrap-container welcome-container">
    <div class="row">
        <div class="welcome-left-container col-lg-9">
            <div class="chart-panel panel panel-default">
                <div class="panel-body" id="chart" style="height: 376px;">
                </div>
            </div>
        </div>
    </div>
</div>


<script type="text/javascript">
    layui.use(['layer','jquery','laydate'], function() {
        var $ = layui.jquery
            , resize = layui.resize
            , layer = layui.layer
            , laydate = layui.laydate;

        var myChart;
        require.config({
            paths: {
                echarts: '/admin/lib/echarts'
            }
        });
        require(
            [
                'echarts',
                'echarts/chart/bar',
                'echarts/chart/line',
                'echarts/chart/map'
            ],
            function (ec) {
                //--- 折柱 ---
                myChart = ec.init(document.getElementById('chart'));
                myChart.setOption(
                    {
                        title: {
                            text: '药房收支',
                            //subtext: '纯属虚构'
                        },
                        tooltip: {
                            trigger: 'axis'
                        },
                        legend: {
                            data: ['收入', '支出']
                        },
                        toolbox: {
                            show: true,
                            feature: {
                                mark: {show: false},
                                dataView: {show: true, readOnly: true},
                                magicType: {show: true, type: ['line', 'bar']},
                                restore: {show: true},
                                saveAsImage: {show: true}
                            }
                        },
                        calculable: true,
                        xAxis: [
                            {
                                type: 'category',
                                data: ['1998-10-10', '2019-07-03', '2019-07-04', '2019-07-05'],
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value',
                            }
                        ],
                        series: [
                            {
                                name: '收入',
                                type: 'bar',
                                data: ['0','1','8','60'],
                                markPoint : {
                                    data : [
                                        {type : 'max', name: '最大值'},
                                        {type : 'min', name: '最小值'}
                                    ]
                                },
                                markLine : {
                                    data : [
                                        {type : 'average', name: '平均值'}
                                    ]
                                }

                            },{
                                name: '支出',
                                type: 'bar',
                                data: ['14', '11', '2', '100'],
                                markPoint : {
                                    data : [
                                        {name : '最高', value : 100, xAxis:4, yAxis: 100, symbolSize:18},
                                        {name : '最低', value : 0, xAxis: 1, yAxis: 1}
                                    ]
                                },
                                markLine : {
                                    data : [
                                        {type : 'average', name : '平均值'}
                                    ]
                                }
                            }
                        ]
                    })
            })

             var arry = [];//日期
             var arry1 = [];
             var arry2 = [];

        //日期范围
        laydate.render({
            elem: '#test6'
            , range: true
            , done: function (value, date, endDate) {
                alert(value);
                var string1 = value.substring(0, 10);
                var string2 = value.substring(13, 24);
                console.log(string1)
                console.log(string2)





            }
        })
    })






</script>
</body>
</html>